<template>
  <div class="el-bg">
    <!-- <BombTips v-bind.sync="showBombTips" :tipsContent="tipsContent"></BombTips> -->
    <div class="content-body">
      <div class="el-content">
        <span>Get an up to ₦30000 credit line,Enroll to LinkCredit pre-launch program now.</span>

        <div class="el-title-invitation">
          <span>Invitation Code</span>
        </div>
      </div>

      <div class="el-invitation">
        <span class="invitation-text">{{invitationCode}}</span>
      </div>

      <button class="buttons" @click="handleCopy()">
        <span class="button-text">Copy Invitation Code</span>
      </button>

      <div class="el-download">
        <span>Downloan LinkCredit</span>
      </div>

      <img class="el-google" :src="googlePlay" @click="googlePlays()">
    </div>
  </div>
</template>

<script>
/* import BombTips from "@/components/BombTips.vue"; */
export default {
  name: "Invite Friends",
  /* components: { BombTips }, */
  data() {
    return {
      /* showBombTips: {
        visible: true
      },
      tipsContent: "XXXXXXXXXX", */
      googlePlay: require('../assets/images/google_play.png'),
      invitationCode: "",
      googlePlayUrl: "https://play.google.com/store/apps/details?id=com.google.android.apps.maps",
      //googlePlayUrl: "market://details?id=<package_name>",
      appPackageName: "com.google.android.apps.maps",
    };
  },
  created() {
    document.title = 'Invite Friends';
    var query=this.$route.query;
    this.invitationCode = query.code;
  },
  methods: {
    handleCopy() {
      var input = document.createElement("input");   // js创建一个input输入框
      input.value = this.invitationCode;  // 将需要复制的文本赋值到创建的input输入框中
      document.body.appendChild(input);    // 将输入框暂时创建到实例里面
      input.select();   // 选中输入框中的内容
      document.execCommand("Copy"); // 执行浏览器复制命令
      document.body.removeChild(input); // 最后删除实例中临时创建的input输入框，完成复制操作
        this.$message({
          message: 'Copy Success',
          type: 'success'
        });
    },
    googlePlays() {
      //window.location.href = 'market://details?id=link.Credit';
      //window.location.href = 'linkcredit://open';
      //window.location.href = 'linkcredit://invite';
      window.location.href = "https://play.google.com/store/apps/details?id=link.Credit";
      //window.location.href = "https://play.google.com/store/apps/details?id=com.google.android.apps.maps";
      /* var u = navigator.userAgent;
      var isWeixin = u.toLowerCase().indexOf('micromessenger') !== -1; // 微信内
      var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端
      var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

      // 微信内
      if(isWeixin) {
        alert('请在浏览器上打开')
      } else {
        //android端
        if (isAndroid) {
          //安卓app的scheme协议
          window.location.href = 'market://details?id=com.lucky.luckyclient';
          //window.location.href = 'taobao://';
          setTimeout(function(){
          let hidden = window.document.hidden || window.document.mozHidden || window.document.msHidden ||window.document.webkitHidden
            if(typeof hidden =="undefined" || hidden ==false){
              window.location.href = "https://play.google.com/store/apps/details?id=com.google.android.apps.maps";
            }
          }, 2000);
        }
        //ios端
        if (isIOS) {
          //ios的scheme协议
          //window.location.href = 'taobao://'
          window.location.href = 'itms-apps://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=sfdfds'
          setTimeout(function(){
            let hidden = window.document.hidden || window.document.mozHidden || window.document.msHidden ||window.document.webkitHidden
            if(typeof hidden =="undefined" || hidden ==false){
              window.location.href = "https://play.google.com/store/apps/details?id=com.google.android.apps.maps";
              //window.location.href = "http://itunes.apple.com/app/id387682726";
              //window.location.href = "https://itunes.apple.com/us/app/xxx/idxxx?mt=8";
            }
          }, 2000);
        }
      } */


          //startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse("market://details?id=" + appPackageName)));

          //startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse("https://play.google.com/store/apps/details?id=" + appPackageName)));

      /* this.tipsContent = "Copy Success";
      this.showBombTips = {
        visible: true
      }; */
        /* this.$message({
          message: 'googlePlayUrl',
          type: 'success'
        }); */
    }
  }
};
</script>

<style rel="stylesheet/scss" lang="scss">
.el-bg {
  /* display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start; */
  height: 100%;
  width: 100%;
  //padding-top: 50%;
  background-image: url("../assets/images/friends-background.png");
  background-size:100% 100%;
}

.content-body {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  position: absolute;
  //-moz-transform: translate(-50%, -50%);
  top: 40%;
  width: 100%;
  //background-color: #0000FF;
}

.el-content {
  //margin-top: 30px;
  line-height: 25px;
  width: 85%;
  text-align: center;
  color: #fff;
  font-family: Arial;
  font-size: 14px;
  letter-spacing: 0.5px;

  .el-title-invitation {
    margin-top: 20px;
    color: #fff;
    font-family: Arial;
    font-size: 16px;
  }
}


.el-invitation {
    margin-top: 10px;
    border: 1px solid #ffffff;
    border-radius: 10px;
    width: 200px;
    height: 40px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: center;
    .invitation-text{
      color: #fff;
      font-family: Arial;
      font-size: 20px;
      letter-spacing: 8px;
    }
  }

.buttons {
        margin-top: 30px;
				border: 1px solid #ccc;
				border-radius: 25px;
				width: 200px;
				height: 40px;
				color: white;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        text-align: center;
        background: #fff;
			}
			.button-text {
				color: #00aa00;
        font-family: Arial;
        font-size: 14px;
        letter-spacing: 0.6px;
			}

  .el-download {
      margin-top: 30px;
      line-height: 25px;
      width: 85%;
      text-align: center;
      color: #fff;
      font-family: Arial;
      font-size: 14px;
      letter-spacing: 0.6px;
    }

.el-google {
  margin-top: 10px;
  width: 150px;
  margin-bottom: 10px;
}

</style>
